<template>
    <view class="list">
        <view
            v-for="item in list"
            :key="item.path"
            :style="{
                backgroundImage: 'url(' + item.imageUrl + ')',
                width: '630rpx',
                height: '180rpx',
                backgroundSize: 'cover',
                margin: ' 20rpx 0',
            }"
            @click="toPage(item.path)"
        >
            <text class="title">{{ item.title }}</text>
            <text class="tips">{{ item.tips }}</text>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            list: [
                {
                    imageUrl:
                        "https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2024/04/07/9f6fc8f4ab784bf593a8db72502d2db6.png",
                    path: "/pages_statisticAnalysis/customer_inventory/index",
                    title: "客户盘点",
                    tips: "针对所有客户的数据图表分析",
                },
                {
                    imageUrl:
                        "https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2024/04/07/3556ee63ce384183a6aae790edb8d7f3.png",
                    path: "/pages_statisticAnalysis/customer_trading_volume/index",
                    title: "客户成交量",
                    tips: "针对所有客户的成交量数据展示列表",
                },
                {
                    imageUrl:
                        "https://oneredhealth.oss-cn-hangzhou.aliyuncs.com/2024/04/07/79babebf7b474d5f8e41fbc42b1c1492.png",
                    path: "/pages_statisticAnalysis/customer_service/index",
                    title: "客户服务",
                    tips: "针对所有客户的服务数据展示列表",
                },
            ],
        };
    },
    methods: {
        toPage(path) {
            uni.$u.route({
                url: path,
            });
        },
    },
};
</script>

<style>
page {
    background-color: #fff;
}
</style>

<style lang="scss" scoped>
.list {
    padding: 60rpx 50rpx;
    box-sizing: border-box;
}
.title,
.tips {
    display: block;
    color: #fff;
}
.title {
    font-size: 36rpx;
    padding: 36rpx 0 0 110rpx;
}
.tips {
    font-size: 24rpx;
    padding: 20rpx 0 0 66rpx;
}
</style>
